﻿<!DOCTYPE html>
<html>
<head>
	<title>个人信息</title>

	<link rel="stylesheet" type="text/css" href="${base}/css/base.css">
	<link rel="stylesheet" type="text/css" href="${base}/css/nav2.css">
	<link rel="stylesheet" type="text/css" href="${base}/css/profile.css">
	<link rel="stylesheet" type="text/css" href="${base}/css/profile-follow-tab.css">

</head>
<body>
	<#assign base = request.contextPath/>
	<base id="baseUrl" href="${base}/"/>
	<div class="nav">
		<div class="wrap">
			<a href="${base}/" class="logo">问答</a>
			<ul class="nav-top">
				<li><a href="${base}/">首页</a></li>
				<li><a href="${base}/explore">发现</a></li>
				<li><a href="${base}/topics">话题</a></li>
			</ul>
			<div class="search-area">
				<form action="${base}/listTopicByTopicName" action="post">
					<input type="text" name="topicName" placeholder="搜索你感兴趣的内容...">
					<button class="magnifier"></button>
					<button class="ask">提问</button>
				</form>
			</div>
			<div class="nav-right">
				<a href="${base}/message" class="message"></a>
				<a href="" class="profile"><img class="profile-avatar" src=""></a>
			</div>
		</div>
	</div>

	<div class="profile-wrap">
		<div class="profile-header">
			<div class="profile-bgc">
				<img src="http://od6v5lenq.bkt.clouddn.com/1484c2a1-8f6d-4603-9316-94f87217e380.jpg">
			</div>
			<div class="profile-info">
				<div class="profile-avatar">
					<img src="${user.avatarUrl}">
				</div>

				<div class="two-button" id="isSelf" data-id="${isSelf?c}">
					<#if isSelf==true>
						<a href="${base}/setting" class="follow-button">编辑信息</a>
					<#else>
						<button id="followUserButton" class="follow-button">关注</button>
						<button id="unfollowUserButton" class="unfollow-button">取消关注</button>
					</#if>
				</div>

				<div class="info-title">
					<span>${user.username}</span>
					<span>${user.simpleDesc}</span>
				</div>
				<#if user.position?? >
					<div class="info-item">
						<span class="item-key">居住地</span>
						<div class="item-value">${user.position}</div>
					</div>
				</#if>
				<#if user.industry?? >
					<div class="info-item">
						<span class="item-key">所在行业</span>
						<div class="item-value">${user.position}</div>
					</div>
				</#if>
				<#if user.career?? >
					<div class="info-item">
						<span class="item-key">职业经历</span>
						<div class="item-value">${user.career}</div>
					</div>
				</#if>
				<#if user.education?? >
					<div class="info-item">
						<span class="item-key">教育背景</span>
						<div class="item-value">${user.education}</div>
					</div>
				</#if>
				<#if user.fullDesc?? >
					<div class="info-item">
						<span class="item-key">个人简介</span>
						<div class="item-value">${user.fullDesc}</div>
					</div>
				</#if>
			</div>
		</div>

		<div class="main">
			<div class="content" id="content">
				<ul class="tab-header">
					<li><a href="${base}/profile/${user.userId}" id="tab-header-answer">回答</a></li>
					<li><a href="${base}/profileQuestion/${user.userId}" id="tab-header-question" >提问</a></li>
					<li><a href="${base}/profileCollection/${user.userId}" id="tab-header-collection" >收藏</a></li>
					<li><a href="${base}/profileFollowPeople/${user.userId}" id="tab-header-follow" class="tab-header-active">关注</a></li>
				</ul>



				<div class="follow-tab" id="follow-tab">
					<div class="tab-title">
						<a id="following-collection">关注的收藏夹</a>
					</div>

					<div class="tab-content">

						<div class="following-collection-list">
							<ul>
								<#list collectionList as collection>
								<li>
									<div class="collection-info">
										<p class="collection-name"><a href="#">${collection.collectionName}</a></p>
										<div class="collection-info-meta">
											<span>${collection.updateTime?number_to_date} 更新</span><span class="dot-split">.</span>
											<span>${collection.answerCount} 条内容</span><span class="dot-split">.</span>
											<span>${collection.followedCount} 人关注</span>
										</div>
									</div>
								</li>
								</#list>
							</ul>
						</div>
					</div>
				</div>
			</div>



			<div class="sidebar">
				<div class="profile-achieve">
					<h3>个人成就</h3>
					<div class="achieve-info">
						<p><i class="sprite-thumb"></i>&nbsp;&nbsp;&nbsp;获得<span> ${user.likedCount} </span>次赞同</p>
						<p>获得<span> ${user.collectedCount} </span>次收藏</p>
					</div>
				</div>

				<div class="follow-info">
					<div class="follow-people">
						<div class="wrap">
							<h4>
								<p>关注了</p>
								<p>${user.followCount}</p>
							</h4>
							<h4>
								<p>关注者</p>
								<p>${user.followedCount}</p>
							</h4>
						</div>
					</div>

					<div class="follow-other" id="follow-other">
						<ul>
							<li>
								<a id="sidebar-following-topic" href="${base}/profileFollowTopic/${user.userId}" >
									<span>关注的话题</span>
									<span>${user.followTopicCount}</span>
								</a>
							</li>
							<li>
								<a id="sidebar-following-question" href="${base}/profileFollowQuestion/${user.userId}" >
									<span>关注的问题</span>
									<span>${user.followQuestionCount}</span>
								</a>
							</li>
							<li class="tab-header-active-second">
								<a id="sidebar-following-collection" href="${base}/profileFollowCollection/${user.userId}" >
									<span>关注的收藏夹</span>
									<span>${user.followCollectionCount}</span>
								</a>
							</li>
						</ul>
					</div>
				</div>

				<div class="footer">
					<a href="#">建议反馈</a>
					<span> • </span>
					<a href="#">联系我们</a>
					<div></div>
					<span>@ 2017 蛤乎</span>
				</div>
			</div>


		</div>
	</div>


<script type="text/javascript" src="${base}/js/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="${base}/js/profile.js"></script>



</body>
</html>